<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{fragments/layout :: head('用户详情')}"></head>
<body>
    <!-- 导航栏 -->
    <nav th:replace="~{fragments/layout :: navbar}"></nav>
    
    <!-- 页面内容 -->
    <div th:replace="~{fragments/layout :: content(~{::main})}">
        <main>
            <div class="row justify-content-center">
                <div class="col-md-10">
                    <div class="card shadow">
                        <div class="card-header bg-primary text-white">
                            <h4 class="my-2">用户详情</h4>
                        </div>
                        <div class="card-body p-4">
                            <div class="row">
                                <div class="col-md-6">
                                    <h5 class="mb-3">基本信息</h5>
                                    <table class="table table-bordered">
                                        <tr>
                                            <th style="width: 30%">用户名</th>
                                            <td th:text="${user.username}">username</td>
                                        </tr>
                                        <tr>
                                            <th>姓名</th>
                                            <td th:text="${user.name}">姓名</td>
                                        </tr>
                                        <tr>
                                            <th>邮箱</th>
                                            <td th:text="${user.email}">email@example.com</td>
                                        </tr>
                                        <tr>
                                            <th>角色</th>
                                            <td>
                                                <span class="badge bg-secondary" th:text="${user.role.name}">ROLE</span>
                                            </td>
                                        </tr>
                                        <tr>
                                            <th>注册时间</th>
                                            <td th:text="${#temporals.format(user.createdAt, 'yyyy-MM-dd HH:mm')}">2023-01-01</td>
                                        </tr>
                                        <tr>
                                            <th>状态</th>
                                            <td>
                                                <span th:if="${user.enabled}" class="badge bg-success">正常</span>
                                                <span th:unless="${user.enabled}" class="badge bg-danger">已禁用</span>
                                            </td>
                                        </tr>
                                    </table>
                                </div>
                                <div class="col-md-6">
                                    <h5 class="mb-3">操作</h5>
                                    <div class="d-flex gap-2 mb-4">
                                        <a th:href="@{/admin/users/edit/{id}(id=${user.id})}" class="btn btn-warning">
                                            <i class="fas fa-edit"></i> 编辑用户
                                        </a>
                                        <form th:action="@{/admin/users/{id}/delete(id=${user.id})}" method="post" class="d-inline">
                                            <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}" />
                                            <button type="submit" class="btn btn-danger" onclick="return confirm('确定要删除该用户吗？此操作不可恢复！')">
                                                <i class="fas fa-trash-alt"></i> 删除用户
                                            </button>
                                        </form>
                                    </div>
                                </div>
                            </div>

                            <div class="mt-4">
                                <h5 class="mb-3">借阅记录</h5>
                                <table class="table table-striped table-hover">
                                    <thead>
                                    <tr>
                                        <th>图书</th>
                                        <th>借阅日期</th>
                                        <th>应还日期</th>
                                        <th>归还日期</th>
                                        <th>状态</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr th:each="loan : ${loans}">
                                        <td th:text="${loan.book.title}">图书标题</td>
                                        <td th:text="${#temporals.format(loan.borrowDate, 'yyyy-MM-dd')}">2023-01-01</td>
                                        <td th:text="${#temporals.format(loan.dueDate, 'yyyy-MM-dd')}">2023-01-15</td>
                                        <td th:text="${loan.returnDate != null ? #temporals.format(loan.returnDate, 'yyyy-MM-dd') : '未归还'}">2023-01-10</td>
                                        <td>
                                            <span th:if="${loan.returnDate != null}" class="badge bg-success">已归还</span>
                                            <span th:if="${loan.returnDate == null && #temporals.createNow().isBefore(loan.dueDate)}" class="badge bg-primary">借阅中</span>
                                            <span th:if="${loan.returnDate == null && #temporals.createNow().isAfter(loan.dueDate)}" class="badge bg-danger">已逾期</span>
                                        </td>
                                    </tr>
                                    <tr th:if="${loans.empty}">
                                        <td colspan="5" class="text-center">该用户暂无借阅记录</td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                        <div class="card-footer">
                            <a th:href="@{/admin/users}" class="btn btn-outline-secondary">
                                <i class="fas fa-arrow-left"></i> 返回用户列表
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </main>
    </div>
    
    <!-- 页脚 -->
    <footer th:replace="~{fragments/layout :: footer}"></footer>
    
    <!-- 脚本 -->
    <div th:replace="~{fragments/layout :: scripts}"></div>
</body>
</html>
